<template>
	<view class="comment-list">
		<view><text class="text">评论</text></view>
		<view v-for="(comment, index) in commentList">
			<moment-comment-item :comment="comment"></moment-comment-item>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from "vue";

	const commentList = ref([{
		info: {
			avatar: "https://pic1.zhimg.com/v2-da2b0a3b96103d87a682409fc5a261a9_r.jpg?source=1def8aca",
			username: "张三",
			publicTime: "2024年2月3日"
		},
		content: {
			text: "你好，我是张三",
			imageList: []
		}
	}, {
		info: {
			avatar: "https://pic1.zhimg.com/v2-da2b0a3b96103d87a682409fc5a261a9_r.jpg?source=1def8aca",
			username: "李四",
			publicTime: "2024年2月3日"
		},
		content: {
			text: "你好，我是李四",
			imageList: []
		}
	}]);
</script>

<style lang="scss">
	.text {
		font-size: 18px;
		font-weight: bold;
		color: #E09AB5;
		text-align: left;
		margin-left: 15rpx;
	}

	.comment-list {
		border-radius: 10px;
		padding: 10px;
		background: #ffffff;
		margin: 5px;
	}
</style>